<style type="text/css">
    #elevationDiv {
        padding: 12px;
        background-color: rgba(0, 0, 0, 0.5);
        color: white;
        font-size: 0.8em;
    }
    #elevationDiv label,
    #elevationDiv input {
        cursor: pointer;
    }
</style>

<h2>Toggle Ground Elevation</h2>

<div class="web-gl-warning" ng-show="vm.showViewError">WebGL is not supported on your platform/browser.</div>

<esri-scene-view map="vm.map" 
    view-options="{
        camera: {
            position: [7.654, 45.919, 5184],
            tilt: 80
        }
    }"
    on-load="vm.onViewLoaded"
    on-error="vm.onViewError"
    ng-hide="vm.showViewError">
    
    <div id="elevationDiv" ng-show="vm.viewLoaded">
        <label>Elevation: <input type="checkbox" checked ng-click="vm.updateElevation($event)"></label>
    </div>

</esri-scene-view>

<p>Based on <a href="https://developers.arcgis.com/javascript/latest/sample-code/scene-toggle-elevation/index.html">this sample</a>.</p>
